<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<body>
<%--标题栏--%>
<div class="layui-row top">
    <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
        <div class="layui-row top_title">
            <div style="display: flex">
                <img style="width: 72px;height: 72px; border-radius: 50%;margin: 6px 12px;" alt=""
                     src="static/img/zhuzhu.jpg"/>
                <p style="font-family: 华文隶书;font-size: 50px;line-height: 86px;padding: 0 8px;color: #ededed;">
                    校园物品交易系统</p>
            </div>
        </div>
        <div class="layui-row top_menu">
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                <div class="top_menu_group1">
                    <ul class="layui-nav" style="background: #ffffff00">
                        <li class="layui-nav-item">
                            <a href="product/list"><i class="layui-icon"
                                                      style="font-size: 16px">&#xe68e;</i>
                                首页</a>
                        </li>
                        <li class="layui-nav-item">
                            <a href="${sessionScope.user.realName == null ? "javascript:msg();": 'product/release'}"><i
                                    class="layui-icon" style="font-size: 16px">&#xe735;</i> 发布商品</a>
                        </li>
                        <li class="layui-nav-item">
                            <div onclick="sendMessage()" class="message_btn">
                                <i class="layui-icon" style="font-size: 18px">&#xe618;</i>
                                发布留言
                            </div>
                        </li>

                        <c:if test="${sessionScope.user.accountType == 1}">
                            <li class="layui-nav-item">
                                <a href="admin">
                                    <i class="layui-icon" style="font-size: 18px">&#xe629;</i> 后台管理</a>
                            </li>
                        </c:if>
                    </ul>
                </div>
                <div class="top_menu_group2">
                    <input type="text" name="title" required lay-verify="required" placeholder="搜索你所需要的商品"
                           style="float: left;width: 80%" id="search_input"
                           autocomplete="off" class="layui-input">
                    <button class="layui-btn layui-btn-sm layui-btn-normal" lay-submit lay-filter="formDemo"
                            style="float: right;margin-top: 6px;" onclick="productSearch()">搜索
                    </button>
                </div>
                <div class="top_menu_group3">
                    <ul class="layui-nav" lay-filter="" style="background: #ffffff00">
                        <c:if test="${sessionScope.user != null}">
                            <li class="layui-nav-item">
                                <a href="message/list">
                                    <i class="layui-icon" style="font-size: 16px">&#xe667;<span
                                            style="display: none;margin-left: 20px;"
                                            class="layui-badge"
                                            id="message_bage"></span></i></a>
                            </li>
                        </c:if>
                        <li class="layui-nav-item">
                            <c:if test="${sessionScope.get('user')!=null}">
                                <a href="javascript:void(0);"><img src="${sessionScope.user.avatar}"
                                                                   class="layui-nav-img">${sessionScope.user.username}
                                </a>
                                <dl class="layui-nav-child">
                                    <dd><a href="person/update">修改资料</a></dd>
                                    <dd><a href="person/myRelease?curPage=1">我的发布</a></dd>
                                    <dd><a href="person/myFavorite">我的收藏</a></dd>
                                    <dd><a href="person/myOrder">我的订单</a></dd>
                                    <dd><a href="http://localhost/campus/user/exit">退出登录</a></dd>
                                </dl>
                            </c:if>
                            <c:if test="${sessionScope.get('user')==null}">
                                <a href="login" style="color: red;">
                                    去登录
                                </a>
                            </c:if>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<div style="display: none;padding: 10px;padding-bottom: 0;" id="messageDiv">
    <form id="messageForm" class="layui-form layui-form-pane" action="" lay-filter="messageForm">
        <div class="layui-form-item">
            <label class="layui-form-label">留言类型</label>
            <div class="layui-input-block">
                <select name="messageType" title="">
                    <option value="0">提建议</option>
                    <option value="1">求宝贝</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">请输入留言内容</label>
            <div class="layui-input-block">
                <textarea name="content" placeholder="请输入留言内容" class="layui-textarea" id="messageContent"></textarea>
            </div>
        </div>
    </form>
</div>
<script>

    let isHasUser = '${sessionScope.user != null}'
    var layer = null;
    layui.use('layer', function () {
        layer = layui.layer;
        if (isHasUser === 'true')
            $.ajax({
                url: "http://localhost/campus/message/unReadCount"
                , type: "GET"
                , success: function (res) {
                    let count = res.data.count;
                    if (count !== 0) {
                        $('#message_bage').css('display', 'block');
                        $('#message_bage').text(count);
                    }
                }
            });
    });


    var form = null;
    layui.use('form', function () {
        form = layui.form;
    });

    function msg() {
        layer.msg("发布商品前，请先到个人中心进行实名", {
            icon: 3
            , time: 2000
        });
    }

    function sendMessage() {
        if (isHasUser === 'false') {
            layer.msg("请先登录！");
            return false;
        }
        layer.open({
            type: 1
            , content: $('#messageDiv')
            , area: "460px"
            , title: "发布留言"
            , resize: false
            , btn: ['确定', '取消']
            , yes: function (index) {
                let data = form.val("messageForm");
                if (data["content"] === "") {
                    layer.msg("留言内容不能为空！", {
                        time: 2000
                    });
                    return false;
                } else {
                    $.ajax({
                        url: "http://localhost/campus/message/add"
                        , type: "POST"
                        , contentType: "application/json"
                        , data: JSON.stringify(data)
                        , success: function (res) {
                            let icon = res.success ? 1 : 2;
                            layer.msg(res.message, {
                                icon: icon
                                , time: 2000
                            });
                        }
                    })
                    layer.close(index);
                }
            }
            , btn2: function (index) {
                element.render();
                layer.close(index);
                return false;
            }
            , cancel: function (index) {
                element.render();
                layer.close(index);
                return false;
            }
        });
    }

    function productSearch() {
        var productName = $("#search_input").val();
        let isDisplayNav = $('#flag_isDisplayNav').text() === "0" ? false : true;
        console.log(isDisplayNav);
        if (productName === "") {
            layer.msg("搜索内容不能为空！");
            return false;
        }
        sendJsonParam(0, 1, null, null, productName, null, isDisplayNav);
    }
</script>
</body>
</html>
